<template>
  <div class="pay">
    <div>
  <iv-poptip trigger="hover">
      <iv-button class="screen-reader-text">
       赏
       <!--   -->
      </iv-button>
      
        <div slot="content" class="screen">
          <div>
           <div slot="title" class="tit">微信打赏</div>
              <iv-button type="text" class="btn">
                  <img src="../../assets/weChatpay.png" alt="">
              </iv-button>
           </div>
           <div>
            <div slot="title" style="margin-left: 30px">支付宝打赏</div>
               <iv-button type="text" class="btn" style="margin-left: 30px">
                  <img src="../../assets/alipay.png" alt="" >
                </iv-button>
             </div>
        </div>

  </iv-poptip>
    </div>
    <br>
      <span >多谢小爷打赏</span>
  </div>
</template>

<script type="text/ecmascript-6">
  
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
  .pay
    padding-bottom: 10%
    // margin-left:300px
    width auto
    height :120px
    text-align center
    overflow hidden

    img
      width 100%

  .btn
   border: 1px solid #6190e8; 
   width:100px
   height:100px
   padding:5px
   border-style:dashed;


  .screen
    width:230px
    height:120px
    display: flex;

  .screen-reader-text
    position: relative;
    display: block;
    font-size: 30px;
    width: 62px;
    height: 62px;
    margin: 0 auto;
    color: #6190e8;
    background-color: #fff;
    border: 1px solid #6190e8;

    border-radius: 50%;


</style>
